<template>
    <div>
        <el-row style="margin-top: 50px">
            <el-col :span="4" :offset="8" style="text-align: center">
                <router-link to="/front/invoicing/invoSelectVip">
                    <el-button @click="checkedInvoPay" :class="{ischecked:checkedInvo}">会员结算</el-button>
                </router-link>

            </el-col>
            <el-col :span="4" style="text-align: center">

                <router-link to="/front/invoicing/invoSelectTableNo">
                    <el-button @click="checkedPay" :class="{ischecked:checked}">普通结算</el-button>
                </router-link>

            </el-col>


        </el-row>
        <el-row style="margin-top: 50px">
            <router-view></router-view>
        </el-row>
        <!--<diySelect :optionData="optionData" @choose="choose" size="small"></diySelect>-->
        <!--<paging :obj="pagingData"></paging>-->
    </div>
</template>

<script>
    import {mapActions} from 'vuex'
    import * as url from '../../http/api'
    export default {
        name: "invoicingPage",
        components: {},
        computed: {
        },
        data() {
            return {
                checkedInvo:false,
                checked:false,

            }
        },
        methods: {
            ...mapActions(['invoClearDataAct']),
            invoClearData(){
                this.invoClearDataAct()

            },
            checkedInvoPay(){
                this.invoClearData();
                this.checkedInvo=true;
                this.checked=false;
            },
            checkedPay(){
                this.invoClearData();
                this.checkedInvo=false;
                this.checked=true;
            },
        }
    }
</script>

<style scoped>
.ischecked{
    background-color:#409EFF ;
    color: white;
}
</style>